import React, { Component } from 'react';
import AddInput from "./addInput/AddInput";
import List from "./list/List";
import Footer from "./footer/Footer";
import { connect } from 'react-redux';
import { actionCreator,mapStateToProps,mapDispatchToProps } from '../store/actions'
class TodoList extends Component {
  constructor(props) {
    super(props)
    this.state = {}
  }
  componentDidMount() {
    let data = JSON.parse(localStorage.getItem('data'))
    
    this.props.getData(actionCreator('getData',data?data:[]))
  }
  componentDidUpdate() {
    localStorage.setItem('data',JSON.stringify(this.props.todoList))
  }
  render() {
    let { todoList } = this.props;
    return (
      <div>
        <AddInput></AddInput>
        {/* 未完成任务 */}
        <List type={0} List={ todoList.filter(el =>el.done!==true) }></List>
        {/* 完成任务 */}
        <List type={1} List={ todoList.filter(el => el.done===true) }></List>
        <Footer></Footer>
      </div>
    );
  }
}

export default connect(mapStateToProps,mapDispatchToProps)(TodoList);